import React from "react";

interface ItemProps {
	name: string;
	isPacked: boolean;
}

const Item : React.FC<ItemProps> = ({name, isPacked}) => {
	return <li className="not-packed">{name}{isPacked && '✅'}</li>;
}
const PackageList = () => {
	return (
		<>
			<section>
				<h1>Sally Ride's Packing List</h1>
				<ul>
					<Item name="Space suit" isPacked={true} />
					<Item name="Helmet with a golden leaf" isPacked={true} />
					<Item name="Photo of Tam" isPacked={false} />
				</ul>
			</section>
		</>
	);
};

export default PackageList;
